<?php

use yii\bootstrap\ActiveForm;
use common\helps\tools;

?>
<link rel="stylesheet" href="../static/dist/css/AdminLTE.min.css" type="text/css">
<link rel="stylesheet" href="../static/bootstrap/css/bootstrap.min.css" type="text/css">
<link rel="stylesheet" href="../static/plugins/datatables/jquery.dataTables.css" type="text/css">
<link rel="stylesheet" href="../static/css/admin.css" type="text/css">
<link rel="stylesheet" href="../static/jBox/Skins/Metro/jbox.css" type="text/css">
<link rel="stylesheet" href="../static/plugins/datepicker/datepicker3.css" type="text/css">
<style>
    .dataTable > tbody > tr > td {
        vertical-align: middle;
        font-size: 0.8em;
        padding: 8px 18px;
    }

    .dataTable > thead > tr > th {
        vertical-align: middle;
        font-size: 0.8em;
        text-align: center;
    }

    .examine-content .input-group .form-control {
        margin-bottom: 20px;
        height: 30px;
        line-height: 30px;
    }

    .examine-content button {
        margin: 10px;
    }

    label {
        text-align: right;
    }

    #table_id_example th, td {
        white-space: nowrap;
    }

    #table_list th, td {
        font-family: '微软雅黑';
        font-size: small;
        text-align: center
    }

</style>
<div class="tabs-panel">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <div class="box-header">
                    <div style="margin-bottom: 5px">
                        订单编号：<input class="depart-input" id="preBillNo" style="width: 160px" type="text">&nbsp
                        <button type="button" class="btn btn-primary depart-modal" id="select_button"
                                style="width: 80px; margin-left: 41px">查询
                        </button>&nbsp;
                    </div>
                    <div class="box-body">

                        实付金额:<label id="payPrice"></label><br />
                        状态:<label id="billStatus"></label><br />
                        生成订单号:<label id="billNo"></label><br />

                        <table id="search_list" class="display">
                            <thead>
                            <tr>
                                <th style="width: 13%">物料ID</th>
                                <th style="width: 20%">物料编码</th>
                                <th style="width: 30%">物料名称</th>
                                <th style="width: 30%">售价</th>
                                <th style="width: 30%">数量</th>
                            </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>

                    </div>
                    <div class="box-footer" style="text-align: right;">
                        <button type="button" class="btn btn-primary hideBtn" onclick="showModal()">转账支付</button>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="modal fade" id="add-order-modal" style="background: rgba(236, 230, 230, 0.3);" tabindex="-1"
         role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog" style="width: 80%;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">转账支付</h4>
                </div>
                <div class="modal-body">
                    <div class="box-header">
                        预订单号: <input class="depart-input" id="i_preBillNo" type="text" readonly>
                        转账流水: <input class="depart-input" id="i_payBillNo" type="text">
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" onclick="pay()">确定</button>
                </div>
            </div>
        </div>
    </div>


    <script type="text/javascript" src="../static/plugins/jQuery/jquery-2.2.3.min.js"></script>
    <script type="text/javascript" src="../static/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="../static/plugins/datatables/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="../static/plugins/datatables/dataTables.bootstrap.min.js"></script>
    <script type="text/javascript" src="../static/jBox/jquery.jBox-2.3.min.js"></script>
    <script type="text/javascript" src="../static/jBox/i18n/jquery.jBox-zh-CN.js"></script>
    <!-- 自定义js -->
    <script type="text/javascript" src="/static/plugins/datepicker/bootstrap-datepicker.js"></script>
    <script type="text/javascript" src="/static/plugins/datepicker/locales/bootstrap-datepicker.zh-CN.js"></script>
    <script type="text/javascript" src="/static/app/global.js?version=<?= Yii::$app->params['version'] ?>"></script>
    <script type="text/javascript"
            src="/static/app/bill/detail.js?version=<?= Yii::$app->params['version'] ?>"></script>
    <script type="text/javascript">

        $(function () {

            $("#select_button").on('click', function () {

                var preBillNo = $('#preBillNo').val();
                $.post('/prebill/get-prebill', {preBillNo: preBillNo},
                    function (data) {

                        $("#search_list tbody").empty();
                        $("#payPrice").empty();
                        $("#billStatus").empty();
                        $("#billNo").empty();

                        if (data.code == 200) {

                            $("#payPrice").text(data.data.payPrice);

                            $("#billNo").text(data.data.billNo);

                            var status = '';
                            if (data.data.billStatus == 0) {
                                status = '已取消';
                            } else if (data.data.billStatus == 1) {
                                status = '未支付';
                            } else if (data.data.billStatus == 2) {
                                status = '已支付';
                            } else {
                                status = '未知';
                            }
                            $("#billStatus").text(status);

                            $.each(data.data.details, function (index, detail) {
                                var tr = '<tr>';
                                tr += '<td>' + detail.materielId + '</td><td>' + detail.materielCode + '</td><td>' + detail.materielName + '</td><td>' + detail.salePrice + '</td><td>' + detail.qty + '</td>';
                                tr += '</tr>';
                                $("#search_list tbody").append(tr);
                            })

                            // $.jBox.tip('操作成功', 'success');
                            // table.draw(false);
                        } else {
                            $.jBox.error(data.val, '错误');
                        }
                    },
                    'json'
                );
            });

        })

        function showModal() {
            var preBillNo = $('#preBillNo').val();
            $('#i_preBillNo').val(preBillNo);
            $('#i_payBillNo').val('');
            $('#add-order-modal').modal('show');
        }
        function pay(){


            var preBillNo = $("#i_preBillNo").val();
            var payBillNo = $("#i_payBillNo").val();

            $.post('/prebill/pay-prebill', {preBillNo: preBillNo,payBillNo:payBillNo},
                function (data) {
                    if (data.code == 200) {
                        $('#add-order-modal').modal('hide');
                        $.jBox.tip('操作成功', 'success');
                    } else {
                        $.jBox.error(data.val, '错误');
                    }
                },
                'json'
            );

        }
    </script>
